<template>
  <div>
    <a-card  :bordered="false">
      <!-- 查询区域 -->
      <search :config='searchConfig' @getHeight='getHeight' @search='search' />
      <!-- table区域-begin -->
      <div class='page_table'>
        <vxe-grid
          ref='xGrid'
          v-bind='vexConfig'
          :align='left'
          :border='true'
          :checkbox-config='checkboxConfig'
          :columns='columns'
          :data='dataSource'
          :height='pageHeight-seachHeight-90'
          :loading='loading'
          :resizable='true'
          :showOverflow='true'
          size='mini'
          @checkbox-change='selectChangeEvent'
          @checkbox-all='selectChangeEvent'
        >
          <template #isSuspended='{ row }'>
            <span>{{!Boolean(row.isSuspended) ? "已激活" : "已挂起"}}</span>
          </template>
          <template #action='{ row }'>
            <a href="javascript:void(0);" @click="detail(row)" >查看</a>
          </template>

          <template #pager>
            <vxe-pager
              :currentPage.sync='ipagination.current'
              :layouts="['Total', 'PrevJump', 'PrevPage', 'Number', 'NextPage', 'NextJump','Sizes', 'FullJump']" :page-size.sync='ipagination.pageSize'
              :pageSizes='ipagination.pageSizeOptions'
              :total='ipagination.total' @page-change='handlePageChange'>
            </vxe-pager>
          </template>
        </vxe-grid>
      </div>
      <!-- table区域-end -->
    </a-card>
    <activiti-detail-form ref="activitiForm"></activiti-detail-form>
  </div>
</template>

<script>
  import { PageListMixin } from '@/mixins/PageListMixin'
  import { activitiMixin } from '@/views/activiti/mixins/activitiMixin'
  import ActivitiDetailForm from '@views/activiti/form/ActivitiDetailForm'
export default {
  name: "done-manage",
  mixins:[activitiMixin,PageListMixin],
  components: { ActivitiDetailForm },
  data() {
    return {
      openSearch: true,
      openTip: true,
      selectCount: 0, // 多选计数
      selectList: [], // 多选数据
      modalType: 0, // 添加或编辑标识
      modalVisible: false, // 添加或编辑显示
      modalTitle: "", // 添加或编辑标题
      form: {
        // 添加或编辑表单对象初始化数据
        reason: ""
      },
      formValidate: {
        // 表单验证规则
      },
      //查询区域
      searchConfig: [
        {
          type: 'input',
          name: 'name',
          placeholder: '任务名称'
        }
      ],
      columns: [
        {
          type: 'checkbox',
          width: 60,
          fixed: 'left'
        },
        {
          title: '标题',
          minWidth: 80,
          field: 'processTitle'
        },
        {
          title: '流程名称',
          minWidth: 80,
          field: 'processName'
        },
        {
          title: '流程编号',
          minWidth: 80,
          field: 'crmProcessInstanceId'
        },
        {
          title: 'id',
          minWidth: 80,
          field: 'id'
        },
        {
          title: '任务发起人',
          minWidth: 80,
          field: 'commitName'
        },
        {
          title: '发起时间',
          minWidth: 80,
          field: 'commitDate'
        },
        {
          title: '当前业务',
          minWidth: 80,
          field: ''
        },
        {
          title: '业务ID',
          minWidth: 80,
          field: 'businessId'
        },
        {
          title: '流程状态',
          minWidth: 80,
          field: 'bpmStatusName',
        },
        {
          title: '操作',
          field: 'action',
          minWidth: 80,
          slots: { default: 'action' },
        }
      ],
      submitLoading: false, // 添加或编辑提交状态
      data: [], // 表数据
      total: 0, // 表数据总数
      deleteId: "",
      url:{
        list: window._CONFIG['domianActivitiURL']+'/actBusiness/taskDonePage',
        deleteHistoricTask:window._CONFIG['domianActivitiURL']+'/actTask/deleteHistoric/'
      },
      modalLsVisible: false,
      procInstId: '',
      lcModa: {
        title:'',
        disabled:false,
        visible:false,
        formComponent : null,
        isNew : false
      },
    };
  },
  mounted() {
    this.init();
  },
  methods: {
    init() {
      // this.getDataList();
    },
    handleSearch() {
      this.searchForm.pageNumber = 1;
      this.searchForm.pageSize = 10;
      this.getDataList();
    },
    handleReset() {
      this.searchForm={};
      this.searchForm.pageNumber = 1;
      this.searchForm.pageSize = 10;
      // 重新加载数据
      this.getDataList();
    },
    handelCancel() {
      this.modalVisible = false;
    },
    detail(r) {
      r.id = r.crmProcessInstanceId?r.crmProcessInstanceId:r.id
      this.$refs.activitiForm.edit(r)
    },
    history(v) {
      if (!v.procInstId) {
        this.$message.error("流程实例ID不存在");
        return;
      }
      this.procInstId = v.procInstId;
      this.modalLsVisible = true;
    },
    remove(v) {
      this.postFormAction(this.url.deleteHistoricTask+v.id).then(res => {
        if (res.success) {
          this.$message.success("操作成功");
          this.getDataList();
        }else {
          this.$message.error(res.message);
        }
      });
    },
    handleTableChange(pagination, filters, sorter) {
      //分页、排序、筛选变化时触发
      //TODO 筛选
      if (Object.keys(sorter).length > 0) {
        this.isorter.column = sorter.field;
        this.isorter.order = "ascend" == sorter.order ? "asc" : "desc"
      }
      this.ipagination = pagination;
      // this.loadData();
    },
  },
  watch: {
  }
};
</script>